<template>
	<div>
		<div class="head">
			<router-link tag="div" class="return" to="/My"></router-link>
      {{$t('Safety.v1')}}
		</div>
		<div class="overlay" style="padding: 20px 10px 10px;">
			<div class="overlay-content scrolling">
				<van-cell-group @click="payPwd" v-if="typeof payPwdType != 'string'">
					<van-field readonly :label="payPwdType == 1 ? $t('Safety.v2') : $t('Safety.v3')" right-icon="arrow" />
				</van-cell-group>
				<van-cell-group @click="$router.push({path: '/UpdatePwd'})">
					<van-field readonly :label="$t('Safety.v4')" right-icon="arrow" />
				</van-cell-group>
				<van-cell-group @click="$router.push({path: '/Auxiliaries'})">
					<van-field readonly :label="$t('Safety.v5')" right-icon="arrow" />
				</van-cell-group>
			</div>
		</div>
	</div>
</template>

<script>
	import { safety } from './../utils/api';
	export default {
		data() {
			return {
				payPwdType: ''
			}
		},
		created() {

		},
		mounted() {
			this.tradePass();
		},
		methods: {
			tradePass() { //交易密码
				safety.getTransaction().then(res => { // 判断是否设置交易密码
					if(res.data == 1) { // 1：已设置
						this.payPwdType = 1;
					} else {
						this.payPwdType = 0;
					}
				})
			},
			payPwd() {
				if(typeof this.payPwdType != 'string'){
					this.$router.push({
						path: '/UpdatePayPwd',
						query: {
							type: this.payPwdType
						}
					});
				}
			}
		}
	}
</script>

<style lang="less" scoped>
	.head~.overlay {
		top: 44px;
	}

	.van-cell {
		background-color: #333952;
		color: #FFFFFF;
		font-size: 15px;
		padding: 15px;
	}

	[class*=van-hairline] {
		position: unset;
		border-bottom: 2px solid #2c3145;
	}

	.van-hairline--top-bottom::after {
		border: 0;
	}

	/deep/ .van-field__label {
		max-width: 250px;
	}

	/deep/.van-cell__title span {
		min-width: 250px;
		display: inline-block;
	}
</style>
